<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>login</title>
    <link rel="stylesheet" href="lib/datepicker/skin/WdatePicker.css">
    <link rel="stylesheet" href="lib/bootstrap.min.css">
</head>
<style>
    #pop {
        width: 600px;
        padding: 20px 50px;
        background-color: rgb(104, 122, 90);
        position: fixed;
        left: 50%;
        top: 50%;
        border-radius: 10px;
        transform: translate(-50%, -50%);
    }
</style>

<body>
    <div id="pop">
        <h1 style="text-align: center;">登录</h1>
        <div class="form-horizontal">
            <div class="form-group">
                <label for="data-name" class="col-sm-2 control-label">姓名</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="data-name" placeholder="姓名">
                </div>
            </div>
            <div class="form-group">
                <label for="data-name" class="col-sm-2 control-label">密码</label>
                <div class="col-sm-10">
                    <input type="password" class="form-control" id="data-password" placeholder="密码">
                </div>
            </div>
            <div class="form-group" style="margin-left: 40px;">
                <input type="checkbox" name="" id="rememberme"> <span>30天免登录</span>
            </div>
        </div>
        <div class="form-group" style="float:right;margin-top:20px;">
            <button id="submit" class="btn btn-primary">登录</button>

        </div>
    </div>
    </div>
    <script src="lib/datepicker/WdatePicker.js"></script>
    <script src="lib/jquery.min.js"></script>
    <script src="lib/common.js"></script>
    <script>
        $("#submit").click(function() {
            if ($("#data-name").val() && $("#data-password").val()) {
                $.ajax({
                    url: `${address}/login`,
                    data: {
                        username: $("#data-name").val(),
                        password: $("#data-password").val()
                    },
                    success(data) {
                        if (data === "3") {
                            alert("登陆失败")
                        }
                        if (data === "2") {
                            alert("密码或者用户名错误")
                        } else {
                            // alert("登录成功")
                            //记录30天内免登录逻辑
                            if ($("#rememberme")[0].checked) {
                                let date = new Date()
                                date.setDate(date.getDate() + 30)
                                    // console.log(date); //时间就是加了30天的时间
                                document.cookie = `userInfo=${data};expires=${date}`
                            }
                            sessionStorage.setItem("userInfo", data)
                            location.href = `${address}/students.html`
                        }
                        console.log(typeof(data)); //字符串
                    }
                })
            }
        })
    </script>
</body>

</html>